<template>
  <div id="dialogPubRead">
    <el-dialog
      class="pub-dialog"
      :title="title"
      :visible.sync="dialogData.isShow"
      width="800px"
      :before-close="labelHandleClose"
      :close-on-click-modal="false"
      :modal-append-to-body="false"
      fullscreen
      top="4px"
    >
      <div class="form-box">
        <el-form
          ref="ruleForm"
          :model="ruleForm"
          :rules="rules"
          label-width="80px"
          class="demo-ruleForm"
        >
          <el-form-item label="文章标题" prop="title">
            <el-input
              v-model.trim="ruleForm.title"
              placeholder="请输入文章标题"
              maxlength="32"
              show-word-limit
              clearable
            ></el-input>
          </el-form-item>
          <!--富文本编辑器-->
          <el-form-item label="文章内容" prop="content">
            <quill-editor
              ref="text"
              v-model="ruleForm.content"
              class="myQuillEditor"
              :options="editorOption"
              @change="onEditorChange($event)"
              @blur="onEditorBlur($event)"
            ></quill-editor>
            <div class="limit">
              <span>{{ nowLength }}</span> / {{ maxLen }}
            </div>
            <div v-if="overText" class="red-note">
              文章内容不超过{{ maxLen }}字
            </div>
          </el-form-item>
          <el-form-item class="min-margin" label="设置封面" prop="covers">
            <uploadImg
              :img-info="cover"
              :maxLength="3"
              accept=".jpg,.png"
              @setImgInfo="setCover"
            ></uploadImg>
          </el-form-item>
          <el-form-item label="发布时间" prop="publishDate">
            <el-date-picker
              v-model="ruleForm.publishDate"
              type="datetime"
              placeholder="选择日期时间"
              value-format="yyyy-MM-dd HH:mm:ss"
              :picker-options="pickerOptions"
              :disabled="userProperty === 'USER'"
            >
            </el-date-picker>
          </el-form-item>
          <showTagSelect
            ref="tagSelect"
            channel="ARTICLE"
            @getTagIds="getTagIds"
            :isCanNotEdit="userProperty === 'USER'"
          ></showTagSelect>
          <el-form-item label="选择学院" prop="college">
            <el-select
              v-model="ruleForm.college"
              filterable
              placeholder="选择学院"
              clearable
              :disabled="userProperty === 'USER'"
            >
              <el-option
                v-for="item in collegeList"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择马甲" filterable prop="userId">
            <div v-if="userProperty === 'USER'">{{ userName }}</div>
            <div v-else>
              <el-select
                v-model="ruleForm.userId"
                filterable
                placeholder="请选择马甲"
                :disabled="ruleForm.canRobotRandom === true"
                clearable
              >
                <el-option
                  v-for="item in vestList"
                  :key="item.robotId"
                  :label="item.robotName"
                  :value="item.robotId"
                ></el-option>
              </el-select>
            </div>
          </el-form-item>
          <el-form-item class="min-margin" label="随机马甲">
            <el-switch
              v-model="ruleForm.canRobotRandom"
              :active-value="true"
              :inactive-value="false"
              active-color="#1DC8A4"
              @change="changeRandom(ruleForm.canRobotRandom)"
            ></el-switch>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button
          type="warning"
          class="pc-preview"
          :disabled="notShow"
          @click="toView('PC')"
        >
          PC端预览
        </el-button>
        <el-button type="warning" @click="toView" :disabled="notShow"
          >移动端预览</el-button
        >
        <!--  <el-button type="success" plain @click="cancelLabel">取 消</el-button>-->
        <!--来自内容审核页面-->
        <template v-if="isFromCheck">
          <el-button
            type="primary"
            :loading="notPassLoading"
            @click="showNotPassReason()"
            >不通过</el-button
          >
          <el-button
            type="success"
            :loading="passLoading"
            @click="saveCheck('ruleForm', 'PASS')"
            >保存并公开展示</el-button
          >
          <el-button
            type="danger"
            :loading="rejectLoading"
            @click="showRejectReson"
            >保存并驳回</el-button
          >
        </template>
        <!--来自维护/发布页面-->
        <template v-else>
          <el-button
            type="success"
            :loading="saveLoading"
            @click="save('ruleForm')"
            >保存（草稿）</el-button
          >
          <el-button
            type="danger"
            :loading="loading"
            @click="confirmLabel('ruleForm')"
            >发布</el-button
          >
        </template>
      </span>
    </el-dialog>
    <dialogUploadImg
      :dialogData="dialogUpData"
      @setImgInfo="setImgInfo"
      v-if="dialogUpData.isShow"
    ></dialogUploadImg>
    <!--移动端预览-->
    <dialogQrcode
      v-if="dialogQrcodeData.isShow"
      :dialog-data="dialogQrcodeData"
    ></dialogQrcode>
    <!-- 不通过理由弹窗 -->
    <del-dialog
      v-if="delDialogData.isShow"
      :del-dialog-data="delDialogData"
      @reasonDel="failRequest"
    ></del-dialog>
  </div>
</template>

<script>
import { quillEditor } from 'vue-quill-editor'
import '@assets/css/quill.snow.css'
import {
  pubRead,
  saveRead,
  getDetail,
  editRead,
  editSaveRead
} from '@/api/readManagement/readMine' // 接口
import { checkReads, putReads } from '@/api/readManagement/readCheck' // 接口
import { getVestDetail } from '@/api/vestManagement/vestManage' // 接口
import { userInfo } from '@/api/common/user' // 接口
import {
  sysNormalDisable,
  getVestList,
  getRandomRobotId
} from '@utils/dictionariesFunc'
import dialogUploadImg from '@component/readManagement/readMine/dialogUploadImg' // 上传图片组件
import dialogQrcode from '@component/readManagement/common/dialogQrcode' //预览弹窗
import uploadImg from '@common/uploadImg' // 上传图片公共组件
import showTagSelect from '@common/showTagSelect' // 显性标签下拉选择公共组件
import delDialog from '@common/delDialog' // 不通过理由弹窗
import { getKeyValue } from '@/api/system/parameter' // 接口
export default {
  name: 'dialogPubRead',
  msg: '阅读管理-我的发布---发布作业',
  props: ['dialogData'],
  components: {
    quillEditor,
    dialogUploadImg,
    dialogQrcode,
    uploadImg,
    showTagSelect,
    delDialog
  },
  data() {
    return {
      isAdd: true,
      id: null,
      isFromCheck: false, //是否来自内容审核页面
      loading: false,
      saveLoading: false,
      passLoading: false,
      notPassLoading: false,
      rejectLoading: false,
      title: '', //弹窗title
      collegeList: [{ dictValue: '', dictLabel: '- 请选择学院 -' }], // 学院
      vestList: [{ robotId: '', robotName: '- 请选择马甲 -' }], // 选择马甲
      ruleForm: {
        title: '', //文章标题
        content: '', //文章内容
        textContent: '', //纯文本
        publishDate: '', //发布时间
        college: '', // 学院
        userId: '', // 马甲
        canRobotRandom: false, // 随机马甲 true/false
        covers: [], // 封面图
        userProperty: 'VEST'
      },
      cover: '', // 封面图
      rules: {
        title: [{ required: true, message: '文章标题不能为空' }],
        // userId: { required: true, message: '请选择马甲' },
        college: {
          required: true,
          message: '学院不能为空',
          trigger: 'blur'
        },
        content: {
          required: true
        },
        imgInfo: {},
        publishDate: {},
        userId: { required: true, message: '请选择马甲' }
      },
      nowLength: 0,
      editorIndex: 0, //编辑器光标位置
      editorOption: {
        modules: {
          toolbar: {
            container: [
              ['bold', 'italic', 'underline', 'strike'],
              [{ header: 1 }, { header: 2 }],
              [{ list: 'ordered' }, { list: 'bullet' }],
              [{ color: [] }, { background: [] }],
              [{ align: [] }],
              ['image']
            ],
            handlers: {
              image: (value) => {
                if (value) {
                  // 在这里编写图片按钮点击操作
                  let quill = this.$refs.text.quill
                  this.editorIndex = quill.getSelection()
                    ? quill.getSelection().index
                    : 0
                  this.dialogUpData.isShow = true
                } else {
                  this.quill.format('image', false)
                }
              }
            }
          },
          clipboard: {
            matchers: [[Node.ELEMENT_NODE, this.HandleCustomMatcher]]
          }
        },
        placeholder: '请输入正文'
      },
      clearStyle: false, //是否执行清除样式，true-执行；false-不执行
      dialogUpData: {
        isShow: false
      },
      dialogQrcodeData: {
        isShow: false, // 默认隐藏
        linkUrl: '' // 编辑时，传递的参数
      },
      maxLen: 5000,
      overText: false, //富文本字数是否超过5000
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7
        }
      },
      notShow: false, //是否不可预览
      submitCon: '', //提交内容
      delDialogData: {
        isShow: false,
        params: '',
        type: '不通过'
      },
      userProperty: '', //用户-USER/马甲-VEST
      labelItems: [],
      userName: '', //真实用户姓名
      nameLength: 0,
      saveTime: 5000 //定时缓存文件的时间，单位ms
    }
  },
  watch: {
    'ruleForm.canRobotRandom': {
      // 监听随机马甲
      handler(newValue, oldValue) {
        if (newValue === true) {
          // 随机马甲启用
          this.rules.userId = {}
        } else {
          // 随机马甲关闭
          this.rules.userId = { required: true, message: '请选择马甲' }
        }
      },
      deep: true
    }
  },
  computed: {
    dapengUserId() {
      return this.$store.state.user.dapengUserId
    }
  },
  mounted() {
    this.getStatusList()
    this.getTagNameLength()
    this.isFromCheck = this.dialogData.isFromCheck
    if (this.dialogData.id) {
      //编辑
      this.isAdd = false
      this.id = this.dialogData.id
      this.getFormDetail()
      this.title = this.isFromCheck ? '审核阅读文章' : '编辑阅读文章'
      let readEditCon = localStorage.getItem('readEditCon')
      if (readEditCon) {
        let obj = JSON.parse(readEditCon)
        if (
          obj.readId === this.id &&
          (obj.formData.title || obj.formData.content)
        ) {
          //数据回填
          this.writeData(obj)
        }
      }
      //缓存文章
      this.saveEditCon()
    } else {
      //新增
      this.notShow = true
      this.clearStyle = true
      this.title = '添加我的阅读'
      //新增时增加本地缓存
      let readAddCon = localStorage.getItem('readAddCon')
      if (readAddCon) {
        let obj = JSON.parse(readAddCon)
        if (obj.formData.title || obj.formData.content) {
          //数据回填
          this.writeData(obj)
        }
      }
      //缓存文章
      this.saveAddCon()
    }
  },
  beforeDestroy() {
    clearInterval(this.timer)
  },
  methods: {
    /*清除缓存文章-新增*/
    clearLocalCon() {
      localStorage.removeItem('readAddCon')
    },
    /*清除缓存文章-编辑*/
    clearLocalEditCon() {
      localStorage.removeItem('readEditCon')
    },
    /*缓存文章-新增*/
    saveAddCon() {
      //定时存储编辑数据，防止意外退出
      this.timer = setInterval(() => {
        let conStr = JSON.stringify({
          formData: this.ruleForm,
          labelItems: this.labelItems
        })
        localStorage.setItem('readAddCon', conStr)
      }, this.saveTime)
    },
    /*缓存文章-编辑*/
    saveEditCon() {
      //定时存储编辑数据，防止意外退出
      this.timer = setInterval(() => {
        let conStr = JSON.stringify({
          readId: this.id,
          formData: this.ruleForm,
          labelItems: this.labelItems
        })
        localStorage.setItem('readEditCon', conStr)
      }, this.saveTime)
    },
    /*缓存文章，数据回填*/
    writeData(obj) {
      let _this = this
      this.$confirm(`是否恢复上次编辑的内容？`, '系统提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.clearStyle = false
          this.ruleForm = { ...obj.formData }
          //封面图回填
          let coversAry = obj.formData.covers
          if (coversAry.length > 0) {
            let ary = []
            coversAry.forEach((item) => {
              ary.push({ url: item })
            })
            this.cover = JSON.stringify(ary)
          }
          //显性标签回填
          this.labelItems = obj.labelItems || []
          this.$refs.tagSelect.setValueTagIds(this.labelItems)
          this.$nextTick(() => {
            this.clearStyle = true
          })
        })
        .catch(() => {
          if (_this.id) {
            _this.clearLocalEditCon()
          } else {
            _this.clearLocalCon()
          }
        })
    },
    /* 获取数据状态 */
    async getStatusList() {
      // 学院
      let data = await sysNormalDisable('sys_college')
      this.collegeList = this.collegeList.concat(data)
      // 马甲
      let data1 = await getVestList(this.dapengUserId)
      this.vestList = this.vestList.concat(data1)
    },
    /*文字、图片等，从别处复制而来，清除自带样式，转为纯文本*/
    HandleCustomMatcher(node, Delta) {
      if (this.clearStyle) {
        let ops = []
        Delta.ops.forEach((op) => {
          if (op.insert && typeof op.insert === 'string') {
            ops.push({
              insert: op.insert
            })
          }
        })
        Delta.ops = ops
        return Delta
      } else {
        return Delta
      }
    },
    //获取表单详情
    getFormDetail() {
      let _this = this
      getDetail(
        this.id,
        (response) => {
          this.userProperty = response.userProperty
          if (this.userProperty === 'USER') {
            //真实用户
            userInfo(response.userId, function(res) {
              _this.userName = res.userName
            })
          }
          //标签数据回填
          this.labelItems = this.getlabelInfos(response.labelInfos || [])
          this.$refs.tagSelect.setValueTagIds(this.labelItems)
          this.ruleForm = {
            title: response.textTitle, //文章标题
            content: response.textContent, //文章内容
            publishDate: response.publishDate, //发布时间
            college: response.college, // 学院
            userId: response.userId, // 马甲
            canRobotRandom: false, // 随机马甲 true/false
            covers: response.covers || [] // 封面图
          }
          let ary = []
          response.covers.forEach((item) => {
            ary.push({ url: item })
          })

          this.cover = JSON.stringify(ary)
          if (response.operatorId !== this.dapengUserId) {
            //编辑者不是发布者本人
            getVestDetail(response.userId, (res) => {
              let obj = {
                robotId: res.robotId,
                robotName: res.robotNickname
              }
              this.vestList.push(obj)
            })
          }
          this.$nextTick(() => {
            this.clearStyle = true
          })
        },
        (response) => {
          this.$message.warning(response.message)
        }
      )
    },
    //封面图设置
    setCover(fileAry) {
      let ary = []
      fileAry.forEach((item) => {
        ary.push(item.url)
      })
      this.ruleForm.covers = [...ary]
      /* console.log('封面图设置')
      console.log(this.cover)*/
    },
    //计算富文本编辑器，当前输入的字数
    onEditorChange(event) {
      let value = event.quill.getText()
      this.ruleForm.textContent = value.slice(0, -1)
      if (this.ruleForm.content === '') {
        this.nowLength = 0
      } else {
        this.nowLength = value.length - 1
      }
      this.overText = this.nowLength > this.maxLen ? true : false
      if (this.overText) {
        this.$message.warning(`文章内容不超过${this.maxLen}字`)
      }
    },
    onEditorBlur(event) {},
    /* 显示移动端预览弹窗 */
    toView(type) {
      const viewUrl = `${process.env.VUE_APP_MAIN_URL}details/operator-reading?id=${this.id}`
      if (type === 'PC') {
        window.open(viewUrl)
      } else {
        this.dialogQrcodeData.isShow = true
        this.dialogQrcodeData.linkUrl = viewUrl
      }
    },
    //图片插入富文本编辑器
    setImgInfo(ary) {
      // 获取富文本组件实例
      let quill = this.$refs.text.quill
      if (ary) {
        // 插入图片，res为服务器返回的图片链接地址
        for (let item of ary) {
          quill.insertEmbed(this.editorIndex++, 'image', item.url)
        }
        // 调整光标到最后
        quill.setSelection(this.editorIndex)
      }
    },
    labelHandleClose(done) {
      this.cancelLabel()
      done()
    },
    cancelLabel() {
      // 关闭前清空
      this.loading = false
      this.dialogData.isShow = false
      this.dialogData.id = ''
      this.dialogData.isFromCheck = false
    },
    /* 保存上传视频 */
    async saveVideo(fileData) {
      this.ruleForm.vid = fileData.vid
    },
    /* 改变随机马甲按钮状态 */
    changeRandom(status) {
      if (status === true) {
        // 启用随机马甲
        if (this.vestList.length === 0) {
          this.$message({
            message: '马甲列表为空，无法选择随机马甲',
            type: 'error'
          })
          this.ruleForm.canRobotRandom = true
        }
      }
    },
    //富文本内容替换
    replaceCon() {
      let content = this.$refs.text.value
      /* let content = value.replace(/<(?!\/?IMG|\/?P)[^<>]*>/gi, '')
      content = content.replace(/<P.*?>/gi, '<P>')*/
      if (content.trim().length === 0) {
        this.$message.warning('文章内容不能为空！')
        return ''
      }
      let time = new Date().getTime()
      content =
        `<html><head><link href='https://blob.dapengjiaoyu.com/operate/css/quill-snow.css?${time}' rel='stylesheet' type='text/css'><meta name='viewport' content='width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no'/></head><body><div class='ql-snow'><div class='ql-editor ql-container'>` +
        content +
        '</div></div></body></html>'
      return content
    },
    /*校验封面图个数*/
    regImgLength() {
      //文章图片个数
      let imgLength = 0
      //封面图个数
      let coverLength = this.ruleForm.covers.length
      //计算文章图片个数
      var re = /<img[^<>]*?>/gi
      if (this.ruleForm.content.match(re)) {
        imgLength = this.ruleForm.content.match(re).length
      }
      if (imgLength < 3) {
        //文章图片小于3张，可设置0-1张封面图
        if (coverLength > 1) {
          this.$message.warning('文章内容图片小于3张，可设置0-1张封面图!')
          return false
        }
      } else {
        //文章图片大于等于3张，可设置0-3张封面图
        if (coverLength > 3) {
          this.$message.warning('文章内容图片大于等于3张，可设置0-3张封面图!')
          return false
        }
      }
      return true
    },
    beforSubmit() {
      //文字超过最大限制
      if (this.overText) {
        this.$message.warning(`文章内容不超过${this.maxLen}字`)
        return false
      }

      this.submitCon = this.replaceCon()
      //没有文章内容
      if (!this.submitCon) {
        return false
      }
      //封面图个数不符合要求
      if (!this.regImgLength()) {
        return false
      }
      return true
    },
    /*整合选择的标签*/
    getlabelInfos(resAry) {
      let ary = []
      resAry.forEach((item, index) => {
        let { labelCategoryProperty: labelProperty, labelId, labelName } = item
        let obj = {
          labelProperty,
          labelId,
          labelName
        }
        ary.push(obj)
      })
      return [...ary]
    },
    /*整合选择的标签*/
    setIabelInfos() {
      let ary = []
      this.labelItems.forEach((item, index) => {
        let { labelProperty: labelCategoryProperty, labelId, labelName } = item
        let obj = {
          labelCategoryProperty,
          labelId,
          labelName
        }
        ary.push(obj)
      })
      return [...ary]
    },
    /*保存并通过/驳回*/
    async saveCheck(formName, type, reason) {
      let flog = this.beforSubmit()
      if (!flog) return
      let loadingName = ''
      loadingName = type === 'PASS' ? 'passLoading' : 'rejectLoading'
      this[loadingName] = true
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          let showType = type === 'PASS' ? 'PUBDISPLAY' : ''
          let obj = {
            ...this.ruleForm,
            content: this.submitCon,
            articleId: this.id,
            showType: showType,
            verifyStatus: type,
            userProperty: this.userProperty,
            articleLength: this.nowLength,
            reason
          }
          // userId,随机马甲时，取随机马甲，否则取当前马甲的robotId
          if (this.ruleForm.canRobotRandom === true) {
            obj.userId = (await getRandomRobotId(this.dapengUserId)) || ''
          }
          //选中标签
          obj.labelInfos = this.setIabelInfos()
          checkReads(
            obj,
            (response) => {
              this[loadingName] = false
              this.$emit('refresh')
              this.cancelLabel()
              //保存成功后，清空缓存+定时器
              this.clearLocalEditCon()
              clearInterval(this.timer)
            },
            (response) => {
              this.rejectLoading = false
              this.$message.warning('保存失败，' + response.message)
            }
          )
        } else {
          this[loadingName] = false
          return false
        }
      })
    },
    /* 保存草稿 */
    async save(formName) {
      let flog = this.beforSubmit()
      if (!flog) return
      this.saveLoading = true
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          let obj = { ...this.ruleForm }
          obj.content = this.submitCon
          // userId,随机马甲时，取随机马甲，否则取当前马甲的robotId
          if (this.ruleForm.canRobotRandom === true) {
            obj.userId = (await getRandomRobotId(this.dapengUserId)) || ''
          }
          //选中标签
          obj.labelInfos = this.setIabelInfos()
          if (this.isAdd) {
            saveRead(
              obj,
              (response) => {
                this.saveLoading = false
                this.$emit('refresh')
                this.notShow = false
                this.id = response.id
                this.userProperty = response.userProperty
                this.ruleForm.userId = response.userId
                this.ruleForm.canRobotRandom = false
                this.ruleForm.publishDate = response.publishDate
                this.isAdd = false
                //保存成功后，变成编辑状态，清空缓存+定时器
                this.clearLocalCon()
                clearInterval(this.timer)
                //缓存文章-编辑
                this.saveEditCon()
                /* this.cancelLabel()*/
              },
              (response) => {
                this.saveLoading = false
                this.$message.warning('保存草稿失败，' + response.message)
              }
            )
          } else {
            obj.userProperty = this.userProperty
            editSaveRead(
              obj,
              this.id,
              (response) => {
                this.saveLoading = false
                this.$emit('refresh')
                /* this.cancelLabel()*/
                this.$message.success('操作成功')
              },
              (response) => {
                this.saveLoading = false
                this.$message.warning('编辑失败，' + response.message)
              }
            )
          }
        } else {
          this.saveLoading = false
          return false
        }
      })
    },
    /* 提交 */
    async confirmLabel(formName) {
      let flog = this.beforSubmit()
      if (!flog) return
      this.loading = true
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          let obj = { ...this.ruleForm }
          obj.content = this.submitCon
          // userId,随机马甲时，取随机马甲，否则取当前马甲的robotId
          if (this.ruleForm.canRobotRandom === true) {
            obj.userId = (await getRandomRobotId(this.dapengUserId)) || ''
          }
          //选中标签
          obj.labelInfos = this.setIabelInfos()
          if (this.isAdd) {
            pubRead(
              obj,
              (response) => {
                this.loading = false
                this.$emit('refresh')
                this.cancelLabel()
                //保存成功后，变成编辑状态，清空缓存+定时器
                this.clearLocalCon()
                clearInterval(this.timer)
              },
              (response) => {
                this.loading = false
                this.$message.warning('发布文章失败，' + response.message)
              }
            )
          } else {
            obj.userProperty = this.userProperty
            editRead(
              obj,
              this.id,
              (response) => {
                this.loading = false
                this.$emit('refresh')
                this.cancelLabel()
                //保存成功后，清空缓存+定时器
                this.clearLocalEditCon()
                clearInterval(this.timer)
              },
              (response) => {
                this.loading = false
                this.$message.warning('发布文章失败，' + response.message)
              }
            )
          }
        } else {
          this.loading = false
          return false
        }
      })
    },
    /* 获取选中的显性标签 */
    getTagIds(items) {
      this.labelItems = [...items]
    },
    /* 显示 不通过原因 弹窗 */
    showNotPassReason() {
      this.delDialogData.isShow = true
      this.delDialogData.type = '不通过'
    },
    /* 显示 驳回原因 弹窗 */
    showRejectReson() {
      this.delDialogData.isShow = true
      this.delDialogData.type = '驳回'
      this.delDialogData.from = 'read'
      this.delDialogData.nameLength = this.nameLength
    },
    /*不通过/驳回，选择原因后执行方法*/
    failRequest(reason) {
      let type = this.delDialogData.type
      if (type === '不通过') {
        this.disPass(reason)
      } else if (type === '驳回') {
        this.saveCheck('ruleForm', 'REBUT', reason)
      }
    },
    /* 不通过请求 */
    disPass(reason) {
      let ids = []
      ids.push(this.id)
      this.$confirm(`不通过理由：${reason} 确认不通过该条信息？`, '系统提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.notPassLoading = true
        let params = {
          articleIds: ids,
          reason,
          verifyStatus: 'REJECT'
        }
        putReads(
          params,
          (response) => {
            this.$message({
              message: '操作成功',
              type: 'success'
            })
            this.notPassLoading = false
            this.$emit('refresh')
            this.cancelLabel()
            //保存成功后，清空缓存+定时器
            this.clearLocalEditCon()
            clearInterval(this.timer)
          },
          (response) => {
            this.notPassLoading = false
            this.$message.warning(response.message)
          }
        )
      })
    },
    /*获取驳回原因长度*/
    getTagNameLength() {
      let obj = {
        configKey: 'read_verify_reason_number'
      }
      getKeyValue(
        obj,
        (response) => {
          this.nameLength = response
        },
        (response) => {
          this.$message({
            message: response.message,
            type: 'warning'
          })
        }
      )
    }
  }
}
</script>
<style lang="less" rel="stylesheet/less">
#dialogPubRead {
  @import url('~@common/style/textarea.less');
  .pub-dialog {
    .el-dialog__body {
      padding-top: 5px !important;
      .min-margin {
        margin-bottom: 0px;
      }
    }
  }
  .el-dialog__headerbtn .el-dialog__close {
    color: #000;
  }
  .ql-toolbar.ql-snow {
    padding: 0;
  }
  .red-note {
    position: absolute;
    bottom: -23px;
    padding-left: 10px;
    color: #f00;
  }
  .el-form-item__error {
    padding: 0;
  }
  .el-dialog__wrapper {
    /* z-index: 3000 !important;*/
  }
  .quill-editor {
    .ql-container {
      height: calc(100vh - 162px);
      .ql-editor {
        height: calc(~'100% - 30px');
      }
    }
  }
  .limit {
    height: 30px;
    line-height: 30px;
    text-align: right;
    margin: -30px 0 10px;
    padding-right: 10px;
    span {
      color: #f00;
    }
  }
  .el-button.pc-preview {
    padding: 5px 0 !important;
    a {
      color: #fff;
      padding: 5px 35px;
      &:hover {
        color: #fff;
      }
    }
  }
}
</style>
